<template>
<div class="info-item">
  <div class="key">{{ itemKey }}</div>
  <div class="value">{{ itemValue || '-' }}</div>
  <div class="value" v-if="itemValue2">{{ itemValue2 }}</div>
</div>
</template>

<script>
export default {
  name: "UserInfoItem",
  props: {
    itemKey: {
      type: String,
      default: ''
    },
    itemValue: {
      type: String,
      default: ''
    },
    itemValue2: {
      type: String,
      default: ''
    }
  }
}
</script>

<style scoped>
.info-item {
  width: 100%;
  /*height: 60px;*/
  box-sizing: border-box;
  padding: 16px 20px 0 0;
  display: flex;
  flex-direction: column;
}
.key {
  font-weight: 200;
  font-size: 16px;
  line-height: 22px;
  color: #666666;
}
.value {
  font-size: 16px;
  line-height: 22px;
  color: #333333;
}
</style>
